<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div>
        <h1>The Ajax 03 Page</h1>
        <button onclick="doAjaxGet()">Do Ajax Get</button>
        <button onclick="doAjaxPost()">Do Ajax Post</button>
        <button onclick="doAjaxPostJson()">Do Ajax PostJson</button>
        <button onclick="doAjaxDelete()">Do Ajax Delete</button>
        <button onclick="doAjaxPut()">Do Ajax Put</button>
        <button onclick="doAjax()">Do Ajax</button>
    </div>
    <div id="result">

    </div>
    <script src="js/ajax.js"></script>
    <script>
        function doAjax(){
            ajax({
                requestUrl:"/doAjaxPost",
                requestParams:"id=105&city=guangzhou",
                requestMethod:"POST",
                callback:function(result){
                    document.querySelector("#result").innerHTML=result;
                }
            });
        }

        function doAjaxPut() {
            const url = "/doAjaxPut";
            const params = "id=101&city=jinan";
            ajaxPut(url, params, function (result) {
                //document.querySelector("#result").innerHTML=result;
                alert(result);
            })
        }

        function doAjaxDelete(){
            const url="/doAjaxDelete";
            const params="102";
            ajaxDelete(url,params,function (result){
                //document.querySelector("#result").innerHTML=result;
                alert(result);
            })
        }

        function doAjaxPostJson(){
            const url="/doAjaxPostJson";
            const params={id:"103",city:"xiongan"};//服务端需要@RequestBody
            ajaxPostJSON(url,params,function(result){//回调函数
                alert(result);
            })
        }

        function doAjaxPost(){
            const url="/doAjaxPost";
            const params="id=102&city=shenzhen";
            ajaxPost(url,params,function (result){
                //document.querySelector("#result").innerHTML=result;
                alert(result);
            })
        }

       function doAjaxGet(){
           const url="/doAjaxGet";
           const params="";
           ajaxGet(url,params,function (result){
               document.querySelector("#result").innerHTML=result;
           })
       }



    </script>
</body>
</html>